<template>
	<view class="components-home">
		<view style="margin-top:-50rpx;height: 486rpx; position: relative;margin-bottom: 80rpx;">
			<image src='https://zhoukaiwen.com/img/wccQQP.png' mode='widthFix' class='png' style='width:100%;height:486rpx'></image>
			<!--  -->
		</view>
		
		<swiper class="card-swiper round-dot" previous-margin="1rpx" :indicator-dots="false" :circular="true" :autoplay="true" interval="5000"
		  duration="500" @change="cardSwiper" indicator-color="#ffffff" indicator-active-color="#ffffff" style="margin-top: -320upx;">
		  <swiper-item v-for="(item,index) in swiperList" :key="index" :class="cardCur == index ? 'cur':''">
		    <view class="swiper-item shadow-shop" style="border-radius: 20rpx 20rpx 22rpx 22rpx;">
		      <image :src="item.url" v-if="item.type=='image'" mode="aspectFill" class=""></image>
		    </view>
		  </swiper-item>
		</swiper>

		<view class="title-header">
			<view class="title-text">
				我 / 的 / 设 / 备
			</view>
		</view>

		<view class='nav-list margin-top'>
			<view class="order" v-for="(item, index) in devices" :key="index">
				<view class="item">
					<view class="left">
						<image :src="item.deviceUrl" mode="aspectFill"></image>
					</view>
					<view class="content">
						<view class="title">{{ item.name }}</view>
						<view class="type">{{ item.status }}</view>
						<view class="delivery-time">电量： {{ item.electical }}</view>
						<view class="btnBox">
							<view class="evaluate btn" @click="connectionDevice">点击进行连接</view>
						</view>
					</view>
				</view>
				<u-line color="#f1f1f1" margin="24rpx 0 15rpx 0"></u-line>
			</view>
		</view>
	
		<view style="height: 120rpx;width: 1rpx;"></view>
	</view>
</template>

<script>
	import { DEVICE_ID, SERVICE_UUID, CHARACTOR_ID, NotifyId, setDeviceConfig } from '../../common/deviceInfo.js';
	export default {
		name: 'Components',
		data() {
			return {
				deviceToConnection: null,
				bluetoothDevices:[],
				devices : [
				{
					name : '稳坐宝',
					deviceUrl: 'https://tse2-mm.cn.bing.net/th/id/OIP-C.uClKLjJ6uMTPmOk5fYU_XAHaEj?w=260&h=180&c=7&r=0&o=5&dpr=1.3&pid=1.7',
					status :"未连接",
					electical :"-",
					deviceInfo : {
						deviceId : "60:E8:5B:6C:26:08",
						deviceName :"sitting",
						serviceId : "0000FFF0-0000-1000-8000-00805F9B34FB",
						characterId : ""
					}
				}
				],
				swiperList: [{
				  id: 0,
				  type: 'image',
				  url: 'https://zhoukaiwen.com/img/qdpz/phone1.png',
				}, {
				  id: 1,
				  type: 'image',
				  url: 'https://zhoukaiwen.com/img/qdpz/phone2.png'
				}, {
				  id: 2,
				  type: 'image',
				  url: 'https://zhoukaiwen.com/img/qdpz/phone3.png'
				},{
				  id: 3,
				  type: 'image',
				  url: 'https://zhoukaiwen.com/img/qdpz/phone4.png'
				}],
				cardCur: 0
			}
		},
		methods: {
			cardSwiper(e) {
			  this.cardCur = e.detail.current
			},
			connectionDevice() {
				console.log("conneting。。。")
				uni.showLoading({
					title: "连接中"
				})
				this.initBlue();
			},
			initBlue() {
				uni.openBluetoothAdapter({
					success: (res) => {
						console.log("初始化蓝牙成功");
						console.log(res);
						this.startBluetoothDiscovery()
					},
					fail: (err) => {
						console.log("初始化蓝牙失败");
						uni.hideLoading();
						uni.showToast({
							title:"蓝牙初始化失败",
							duration:1500
						})
						console.error(err);
					}
				});
			},
			
			stopBluetoothDiscovery() {
				uni.stopBluetoothDevicesDiscovery({
					success: (res) => {
						console.log("蓝牙搜索已停止", res);
					},
					fail: (err) => {
						console.error("停止蓝牙搜索失败", err);
					},
				});
			},
			// 2.1 开启搜寻功能
			startBluetoothDiscovery() {
				let retryCount = 0;
				console.log("蓝牙搜索中");
				const startDiscovery = () => {
					uni.startBluetoothDevicesDiscovery({
						success: (res) => {
							console.log("蓝牙搜索已启动", res);
							this.listenBluetoothDevices();
						},
						fail: (err) => {
							console.error("启动蓝牙搜索失败", err);
							if (retryCount < 3) {
								retryCount++;
								setTimeout(startDiscovery, 1000 * retryCount); // 一秒后进行重试
							}else {
								uni.hideLoading();
								uni.showToast({
									title:"蓝牙搜索失败",
									duration:1500
								});
							}
						},
					});
				};
				startDiscovery();
				console.log("蓝牙搜索结束");
			},
			// 2.2 监听搜寻到新设备
			listenBluetoothDevices() {
				//console.log(this.device);
				uni.onBluetoothDeviceFound((res) => {
						this.handleConnection(res, this.devices[0].deviceInfo.deviceName);
				})
			},
			handleConnection(res, deviceInfo) {
				const devices = res.devices;
				this.bluetoothDevices.push(...res.devices);
				for (let i = 0; i < devices.length; i++) {
					// TODO 这里需要对筛选出设备来
					console.log(
						"name:" +
							devices[i].name +
							" id: " +
							devices[i].deviceId +
							", uuid: " +
							devices[i].advertisServiceUUIDs
					);
					if (devices[i].name == deviceInfo) {
						console.log('名称为',deviceInfo);
						this.deviceToConnection = devices[i];
						this.handleBluetoothDeviceClick(devices[i]);
						break;
					}
				}
			},
			// 3 点击进行蓝牙连接
			handleBluetoothDeviceClick(device) {
				console.log(
					"点击了蓝牙设备" + device.deviceId + " " + device.advertisServiceUUIDs
				);
				this.connectBluetoothDevice(
					device.deviceId,
					device.advertisServiceUUIDs[0]
				); // 将device.deviceId传递给连接方法
			},
			connectBluetoothDevice(deviceId, serviceUuid) {
				console.log("待连接的设备id为" + deviceId);
				uni.createBLEConnection({
					deviceId: deviceId,
					success: (res) => {
						console.log("蓝牙设备连接成功", res);
						// 断开连接
						this.stopBluetoothDiscovery();
						this.getCharacteristics(deviceId, serviceUuid);
					},
					fail: (err) => {
						uni.hideLoading();
						console.error("蓝牙设备连接失败", err);
						uni.hideLoading();
						uni.showToast({
							title:"蓝牙设备连接失败",
							duration:1500
						});
						this.connectionFalid = true;
					},
				});
			},
			closeConnection() {
				console.log("正在断开连接");
				uni.closeBLEConnection({
					deviceId: this.deviceId,
					success: (res) => {
						console.log(res);
						console.log("断开连接成功");
					},
					fail: (err) => {
						console.log(err);
						console.log("断开连接失败");
					},
				});
			},
			getCharacteristics(deviceId, serviceUuid) {
				console.log('获取特征值...')
				uni.getBLEDeviceCharacteristics({
					deviceId: deviceId, // 设备ID
					serviceId: serviceUuid, // 服务UUID
					success: (res) => {
						this.characteristicIdList = res.characteristics;
						for (let i = 0; i < this.characteristicIdList.length; i++) {
							if (this.characteristicIdList[i].properties.notify) {
								//console.log("获取特征值成功且赋值成功");
								console.log(this.characteristicIdList[i]);
								uni.hideLoading();
								this.devices[0].electical = 100;
							}
						}
						uni.showModal({
							title: "连接成功"
						});
						// 0000FFF4-0000-1000-8000-00805F9B34FB
						// this.notifyDevice('0000FFF5-0000-1000-8000-00805F9B34FB');
						this.notifyDevice('0000FFF4-0000-1000-8000-00805F9B34FB');
					},
					fail: (err) => {
						console.error("获取特征值失败");
						console.error(err);
						uni.hideLoading();
						this.devices[0].electical = 100;
						uni.showModal({
							title: "连接失败"
						})
					},
				});
			},
			 ab2hex(buffer) {
				let hexArr = Array.prototype.map.call(
					new Uint8Array(buffer),
					function (bit) {
						return ('00' + bit.toString(16)).slice(-2);
					}
				);
				return hexArr.join('');
			},
			listenValue() {
				uni.onBLECharacteristicValueChange((res) => {
				  let resHex = this.ab2hex(res.value);
				  console.log('onBLECharacteristicValueChange 调用成功:', res.value);
				  console.log('进制转换后得到:', resHex);
				  // 在这里进行处理
				});
			},
			notifyDevice(notifyId) {
				console.log("进入了消息监听，下面是特征值:",notifyId);
				console.log("正在进行监听数据");
				// 监听蓝牙特征值变化
				this.listenValueChange();
			},
			listenValueChange() {
				console.log("监听中...");
			// 开始监听特征值变化
			uni.notifyBLECharacteristicValueChange({
					state: true, // 启用 notify 功能
					deviceId: '60:E8:5B:6C:26:08',
					serviceId: '0000FFF0-0000-1000-8000-00805F9B34FB',
					characteristicId: '0000FFF4-0000-1000-8000-00805F9B34FB',
						success(res) {
							console.log('F4 notify 成功:', res);
							// this.listenValue();
							uni.onBLECharacteristicValueChange((res) => {
							  //let resHex = this.ab2hex(res.value);
							  console.log('onBLECharacteristicValueChange 调用成功:', res.value);
							  // console.log('进制转换后得到:', resHex);
							  // 在这里进行处理
							});
						},
						fail(err) {
							console.log('notifyBLECharacteristicValueChange 失败:', err);
						}
				});
				uni.notifyBLECharacteristicValueChange({
					state: true, // 启用 notify 功能
					deviceId: '60:E8:5B:6C:26:08',
					serviceId: '0000FFF0-0000-1000-8000-00805F9B34FB',
					characteristicId: '0000FFF5-0000-1000-8000-00805F9B34FB',
						success(res) {
							console.log('F5 notify 成功:', res);
							//this.listenValue();
							uni.onBLECharacteristicValueChange((res) => {
							  //let resHex = this.ab2hex(res.value);
							  console.log('onBLECharacteristicValueChange 调用成功:', res.value);
							  //console.log('进制转换后得到:', resHex);
							  // 在这里进行处理
							});
						},
						fail(err) {
							console.log('notifyBLECharacteristicValueChange 失败:', err);
						}
				});
				uni.readBLECharacteristicValue({
				  // 这里的 deviceId 需要已经通过 createBLEConnection 与对应设备建立链接
				  deviceId : '60:E8:5B:6C:26:08',
				  // 这里的 serviceId 需要在 getBLEDeviceServices 接口中获取
				  serviceId : '0000FFF0-0000-1000-8000-00805F9B34FB', 
				  // 这里的 characteristicId 需要在 getBLEDeviceCharacteristics 接口中获取
				  characteristicId : '0000FFF5-0000-1000-8000-00805F9B34FB',
				  success(res) {
				    console.log('F5 read成功:', res);
						// this.listenValue();
						uni.onBLECharacteristicValueChange((res) => {
						  //let resHex = this.ab2hex(res.value);
						  console.log('onBLECharacteristicValueChange 调用成功:', res.value);
						  //console.log('进制转换后得到:', resHex);
						  // 在这里进行处理
						});
				  },
					fail(err) {
						console.log('连接错误',err);
					}
				});
			},
			valueProcess(resHex) {
				// 这这里进行逻辑处理
			},
			hexToDecimal(hexString) {
				const decimalList = [];
				for (let i = 2; i < hexString.length; i += 2) {
					const hexValue = hexString.substring(i, i + 2);
					const decimalValue = parseInt(hexValue, 16);
					decimalList.push(decimalValue);
				}
				return decimalList;
			}
		}
	}
</script>


<style lang="scss" scoped>
	.btnBox{
		width: 350rpx;
		display: flex;
		justify-content: space-between;
		.btn {
			line-height: 52rpx;
			width: 350rpx;
			border-radius: 12rpx;
			border: 2rpx solid $u-tips-color;
			font-size: 26rpx;
			text-align: center;
			color: $u-tips-color;
		}
		.evaluate {
			color: $u-type-primary;
			border-color: $u-type-primary;
		}
	}
	
	.order {
	  width: 710rpx;
	  background-color: #ffffff;
	  margin: 20rpx auto;
	  border-radius: 20rpx;
	  box-sizing: border-box;
	  padding: 20rpx;
	  font-size: 28rpx;
	}
	
	.item {
	  display: flex;
	  margin-top: 10rpx;
		padding: 10rpx;
	}
	
	.left {
	  margin-right: 20rpx;
	}
	
	.left image {
	  width: 260rpx;
	  height: 190rpx;
	  border-radius: 10rpx;
	}
	
	.content {
	  display: flex;
	  flex-direction: column;
	  justify-content: space-between;
	  flex: 1;
	}
	
	.title {
	  font-size: 28rpx;
	  font-weight: bold;
	  line-height: 45rpx;
	}
	
	.type {
	  margin: 6rpx 0;
	  font-size: 24rpx;
	  color: #888888;
	  text-overflow: ellipsis;
	  overflow: hidden;
	  white-space: nowrap;
	}
	
	.delivery-time {
	  color: #0081ff;
	  font-size: 24rpx;
	}
	

	.card-swiper {
	  height: 550upx !important;
	}
	
	.card-swiper swiper-item {
	  width: 260upx !important;
	  left: 245upx;	
	  box-sizing: border-box;
	  padding: 0upx 15upx 50upx 15upx;
	  overflow: initial;
	  /* margin: 100rpx 0; */
	}
	
	.card-swiper swiper-item .swiper-item {
	  width: 100%;
	  display: block;
	  height: 100%;
	  border-radius: 10upx;
	  transform: scale(0.7);
	  transition: all 0.2s ease-in 0s;
	  overflow: hidden;
	}
	
	.card-swiper swiper-item.cur .swiper-item {
	  transform: none;
	  transition: all 0.2s ease-in 0s;
	}
	.bg-top-blue {
		background-image: linear-gradient(135deg, #52B5FC, #746BFE);
		color: #fff;
	}

	.nav-list {
		display: flex;
		flex-wrap: wrap;
		padding: 0px 40upx 0px;
		justify-content: space-between;
	}

	.nav-li {
		padding: 30upx;
		border-radius: 12upx;
		width: 45%;
		margin: 0 2.5% 40upx;
		background-image: url(https://s1.ax1x.com/2020/06/27/NyU04x.png);
		background-size: cover;
		background-position: center;
		position: relative;
		z-index: 1;
	}

	.nav-li::after {
		content: "";
		position: absolute;
		z-index: -1;
		background-color: inherit;
		width: 100%;
		height: 100%;
		left: 0;
		bottom: -10%;
		border-radius: 10upx;
		opacity: 0.2;
		transform: scale(0.9, 0.9);
	}

	.nav-li.cur {
		color: #fff;
		background: rgb(94, 185, 94);
		box-shadow: 4upx 4upx 6upx rgba(94, 185, 94, 0.4);
	}

	.nav-title {
		font-size: 32upx;
		font-weight: 300;
	}

	.nav-title::first-letter {
		font-size: 40upx;
		margin-right: 4upx;
	}

	.nav-name {
		font-size: 28upx;
		text-transform: Capitalize;
		margin-top: 20upx;
		position: relative;
	}

	.nav-name::before {
		content: "";
		position: absolute;
		display: block;
		width: 40upx;
		height: 6upx;
		background: #fff;
		bottom: 0;
		right: 0;
		opacity: 0.5;
	}

	.nav-name::after {
		content: "";
		position: absolute;
		display: block;
		width: 100upx;
		height: 1px;
		background: #fff;
		bottom: 0;
		right: 40upx;
		opacity: 0.3;
	}

	.nav-name::first-letter {
		font-weight: bold;
		font-size: 36upx;
		margin-right: 1px;
	}

	.nav-li text {
		position: absolute;
		right: 30upx;
		top: 30upx;
		font-size: 52upx;
		width: 60upx;
		height: 60upx;
		text-align: center;
		line-height: 60upx;
	}

	.text-light {
		font-weight: 300;
	}

	@keyframes show {
		0% {
			transform: translateY(-50px);
		}

		60% {
			transform: translateY(40upx);
		}

		100% {
			transform: translateY(0px);
		}
	}

	@-webkit-keyframes show {
		0% {
			transform: translateY(-50px);
		}

		60% {
			transform: translateY(40upx);
		}

		100% {
			transform: translateY(0px);
		}
	}

	/* 
  2f9bfe 主色蓝
  189eff 配色蓝
  
  0081ff--0070FF 蓝
  CCE6FF--E5F1FF 淡蓝
  39B54A--7FD02B 绿
  D7F0DB--EAF8F5 淡绿
  FBBD08--FFD627 黄
  f37b1d--F39902 橙
  FEF2CE--FEF6E9 淡橙
  1CBBB4--19CF8A 青
  E03997--FF4F94 粉
  8dc63f--9ddb47 橄榄绿
  e54d42--ff3434 红
  a5673f--7F2D00 棕
  6739b6--6F68DF 蓝紫
  */
	.banner-index {
		width: 100%;
		padding: 0 0rpx;
		height: 220rpx;
	}

	.title-header {
		display: flex;
		height: 120rpx;
		font-size: 40rpx;
		align-items: center;
		justify-content: center;
		/* padding: 40rpx 0 0 0; */
		font-weight: bold;
		background-image: url(https://s1.ax1x.com/2020/09/16/wccswF.png);
		background-size: cover;
	}

	.radius-index {
		overflow: hidden;
		border-radius: 10rpx;
	}

	.bg-top {
		background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0));
		color: #fff;
	}

	.tn-btn {
		height: 100%;
		width: 110%;
		line-height: 30rpx;
		background: transparent;
	}

	.tn-btn::after {
		border-color: transparent;
	}

	.tn-bg {
		position: fixed;
		width: 100%;
		z-index: -1
	}

	.tn-bg-cart {
		/* position: fixed; */
		width: 100%;
		z-index: -1
	}

	.bg-gradual-index {
		/* background-image: linear-gradient(45deg, #ff9700, #ed1c24); */
		background-image: linear-gradient(45deg, #1CA5FF, #1B6CFF);
		color: #fff;
	}

	.tn-align {
		text-align: justify;
	}

	.opacity-a {
		opacity: 0.4
	}

	.strip-bottom {
		/* background: #F2F3F9; */
		width: 100%;
		border-bottom: 20rpx solid rgba(241, 241, 241, 0.8);
	}

	.name-title-a {
		-webkit-line-clamp: 1;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		text-overflow: ellipsis;
		overflow: hidden;
	}

	.name-title-b {
		-webkit-line-clamp: 2;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		text-overflow: ellipsis;
		overflow: hidden;
	}

	.tn-footerfixed {
		position: fixed;
		width: 100%;
		bottom: 0;
		z-index: 1024;
		box-shadow: 0 1rpx 6rpx rgba(0, 0, 0, 0.35);
	}

	.tn-border {
		border-top: solid #F3F3F3 20rpx;
	}

	.tn-bg-color {
		background-color: #F3F3F3;
	}

	.text-shop-active {
		/* color: #ff8b00 */
		/* background-image: -webkit-linear-gradient(45deg, #ff7612, #ff571c); */
		background-image: -webkit-linear-gradient(180deg, #ff3434, #ff8a34);
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
	}

	.title-text {
		background-image: -webkit-linear-gradient(0deg, #ff8a34, #FBBD12);
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
		/* border:10px solid #ddd;
      border-image: -webkit-linear-gradient(red,yellow);
     	border-image: -moz-linear-gradient(red,yellow);
      border-image: linear-gradient(red,yellow);  */
	}

	.title-index {
		background-image: -webkit-linear-gradient(0deg, #000, #FBBD12);
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
	}

	.text-shop-no {
		color: #aaaaaa
	}

	.search-round {
		border-radius: 5000rpx;
		/* border-top-right-radius: 20rpx; */
		border-bottom-left-radius: 20rpx
	}

	.shadowimport {
		box-shadow: 0 1rpx 6rpx rgba(0, 0, 0, 0.1) !important;
	}

	/* 标签 */

	.bg-label1.light {
		color: #ff3434;
		background: #fadbd9;
	}

	.bg-label2.light {
		color: #7fd02b;
		background: #eaf8f5;
	}

	.bg-label3.light {
		color: #0070ff;
		background: #e5f1ff;
	}

	.bg-label4.light {
		color: #9ddb47;
		background: #e8f4d9;
	}

	.bg-label5.light {
		color: #f39902;
		background: #fde6d2;
	}

	.bg-label6.light {
		color: #7f2d00;
		background: #ede1d9;
	}

	.bg-label7.light {
		color: #ff4f94;
		background: #f9d7ea;
	}

	.bg-label8.light {
		color: #6f68df;
		background: #e1d7f0;
	}

	.bg-label9.light {
		color: #9c26b0;
		background: #ebd4ef;
	}

	.bg-label10.light {
		color: #19cf8a;
		background: #d2f1f0;
	}

	.bg-label11.light {
		color: #8799a3;
		background: #e7ebed;
	}


	.bg-index1 {
		background-color: #F33F5A;
		color: #fff;
	}

	.bg-index2 {
		background-color: #954FF6;
		color: #fff;
	}

	.bg-index3 {
		background-color: #5177EE;
		color: #fff;
	}

	.bg-index4 {
		background-color: #FFC32E;
		color: #fff;
	}

	.bg-index5 {
		background-color: #FF4F94;
		color: #fff;
	}

	.bg-index6 {
		background-color: #0acffe;
		color: #fff;
	}

	/*  */
	.bg-exper1 {
		background-color: #FF4F94;
		color: #fff;
	}

	.bg-exper2 {
		background-color: #006FFF;
		color: #fff;
	}

	.bg-exper3 {
		background-color: #19D08B;
		color: #fff;
	}

	.bg-exper4 {
		background-color: #F49A02;
		color: #fff;
	}

	.bg-exper5 {
		background-color: #1cbbb4;
		color: #fff;
	}
	.bg-exper6 {
		background-color: #9c26b0;
		color: #fff;
	}
	.bg-exper7 {
		background-color: #8799a3;
		color: #fff;
	}
	.bg-exper8 {
		background-color: #00c4fb;
		color: #fff;
	}
	.bg-exper9 {
		color: #fff;
		background-color: #FFC32E;
	}
	.bg-exper10 {
		color: #fff;
		background-color: #a5673f;
	}
	.bg-exper11 {
		background-color: #BC78EC;
		color: #fff;
	}
	.bg-exper12 {
		background-color: #8DC63F;
		color: #fff;
	}
	.bg-exper13 {
		color: #fff;
		background-color: #ff3434;
	}
	.bg-exper14 {
		color: #fff;
		background-color: #FF4F94;
	}
	.bg-exper15 {
		color: #fff;
		background-color: #6F68DF;
	}
	.bg-exper16 {
		color: #fff;
		background-color: #1cbbb4;
	}

	/*  */
	.bg-kuxuan1 {
		background-color: #FF5656;
		color: #fff;
	}

	.bg-kuxuan2 {
		background-color: #6F68DF;
		color: #fff;
	}

	.bg-kuxuan3 {
		background-color: #9c26b0;
		color: #fff;
	}

	.bg-kuxuan4 {
		background-color: #0070FF;
		color: #fff;
	}

	.bg-kuxuan5 {
		background-color: #1cbbb4;
		color: #fff;
	}

	.bg-kuxuan6 {
		background-color: #BC78EC;
		color: #fff;
	}

	.bg-kuxuan7 {
		background-color: #f39902;
		color: #fff;
	}

	.bg-kuxuan8 {
		color: #fff;
		background-color: #19CF8A;
	}

	.bg-kuxuan9 {
		color: #fff;
		background-color: #8799a3;
	}

	.bg-kuxuan10 {
		color: #fff;
		background-color: #0396FF;
	}

	.bg-kuxuan11 {
		color: #fff;
		background-color: #BC78EC;
	}

	.bg-kuxuan12 {
		color: #fff;
		background-color: #FFC32E;
	}

	.bg-kuxuan13 {
		color: #fff;
		background-color: #a5673f;
	}
	.bg-kuxuan14 {
		color: #fff;
		background-color: #FF4F94;
	}
	.bg-kuxuan15 {
		color: #fff;
		background-color: #8DC63F;
	}
	.bg-kuxuan16 {
		color: #fff;
		background-color: #00c4fb;
	}
</style>
